GORAGOD.com

freelance, web developer, web designer, hosting, domain name

GAJAX บทที่ 15 การเขียนฟังก์ชั่นด้วย Javascript

ผมเขียนบทความนี้เพื่อปรับพื้นฐาน Javascript ของหลายๆคนก่อน เนื่องการการใช้ Javascript ในลักษณะของการใช้ร่วมกับ Frame Work หรือ Class จะมีข้อแตกต่างบางอย่างที่ไม่เหมือนจาก Javascript ปกติที่เราคุ้นเคยกัน แต่ก็ใช่ว่า สิ่งที่ผมจะพูดถึงต่อไปจะใช้ได้กับ Frame Work เท่านั้นนะครับ ยังสามารถนำไปใช้ตามปกติได้ เพียงแต่ผมต้องการทำความเข้าใจเพิ่มเติมเพื่อให้เข้าใจตรงกันและใช้งานได้สะดวก รวมถึงก็จะเป็นการบอกกล่าวสำหรับคนที่ไม่คุ้นเคยกับ Javascript ด้วย

การเขียนฟังก์ชั่นด้วย Javascript
ใน Javascript นั้น ฟังก์ชั่นถูกมองว่าเป็น Object หนึ่งซึ่งอาจมี property ได้ เหมือน Object ทั่วไป รูปแบบการเขียนฟังก์ชั่น สามารถเป็นไปได้ 2 ลักษณะคือ

1. ฟังก์ชั่นในรูปแบบที่เราคุ้นเคยกันดี ตามตัวอย่าง ฟังก์ชั่นนี้ชื่ิอ doShow

function doShow() {
  // do somethiong
  alert(value);
};

2. ฟังก์ชั่นที่ไม่มีชื่อ เป็นรูปแบบหนึ่งของฟังก์ชั่น บน Javascript ซึ่งฟังก์ชั่นนี้จะมีบทบาทอย่างมากสำหรับการนำไปใช้กับ Frame Work

function() {
  // do somethiong
};

ถ้าสังเกตุดู จะเห็นได้ว่า ฟังก์ชั่นในรูปแบบที่ 2 ดูไม่ค่อยมีประโยชน์ เนื่องจากว่าเราไม่รู้จะเรียกใช้มันยังไง แต่ในเมื่อฟังก์ชั่นบน Javascript เป็น Object ดังนั้นมันย่อมถูกอ้างถึงโดยใช้ตัวแปรอ้างอิงได้ เช่น

var doShow= function(value) {
  // do somethiong
  alert(value);
};

จากโค้ด ถ้าเราต้องการเรียกใช้ฟังก์ชั่นนี้ เราก็สามารถเรียกฟังก์ชั่นผ่านตัวแปร doShow ได้ หรือ อาจส่งตัวแปร doShow ให้กับฟังก์ชั่นอื่นเพื่อนำไปใช้งานต่อได้

doShow('demo'); // แสดงข้อความ demo

ตัวอย่างด้านบน อาจดูไม่เป็นประโยชน์นะครับ เนื่องจากมันก็ดูธรรมดางั้นก็ลองมาดูอีกตัวอย่างหนึ่ง

function onSucces(value){alert(value)}; // สร้างอีเวนต์เพื่อแสดงผลการทำงาน

function doShow(value, onComplete) {
  // do something
  onSucces(value); // เรียก event เมื่อทำงานสำเร็จ
};
doShow('test', onSucces); // เรียกใช้ doShow

ในฟังก์ชั่น doShow เราสามารถกำหนดให้ onComplete เป็นฟังก์ชั่นได้เหมือนตัวแปรธรรมดาตัวหนึ่ง ซึ่งฟังก์ชั่นที่ส่งให้กับ doShow บนพารามิเตอร์นี้จะถูกเรียกใช้เมื่อทำการเรียกฟังก์ชั่นพร้อมกับส่งพารามิเตอร์อีกตัวไปยังฟังก์ชั่นได้ด้วย

ตัวอย่างนี้จะเป็นตัวอย่างของการส่งฟังก์ชั่น ให้กับฟังก์ชั่นอีกที สำหรับประโยชน์ของมันก็เช่นการสร้างอีเว้นต์เมือปฏิบัตการโค้ดสำเร็จ เป็นต้น และมันจะเป็นเทคนิคที่จำเป็นอย่างมากสำหรับการเขียน Javascript ในระดับสูงๆต่อไป
0SHAREFacebookLINE it!
^